import React, { Component } from 'react';
import './bannerbottom.css'

const MultItem =(props)=>{
    return (
        <div className="mutl-items">
            <img src={props.src} alt=""/>
        </div>
    )
}

class BannerBottom extends Component {
    constructor(props){
        super(props)
        this.state ={
            itempic:[]
        }
    }

componentWillMount(){
    fetch("/data/multitem.json")
    .then(res=>res.json())
    .then(result=>{
        // console.log(result)
        this.setState({
            itempic:result.data.BannerBottom
        })
    })
    .catch(error=>{console.log(error)})
}

    renderItem(){
        // console.log(result.data.bannerBottom)
            if(this.state.itempic.length){
            return this.state.itempic.map((item)=>{
               return   <MultItem key = {item.id} src = {item.url}/>
            })
     }
    }


    render(){
        return (
            <div className="multi_cell">
                {this.renderItem()}
            </div>
        )
    }
}

export default BannerBottom